<?php  $date = new Zend_Date();
 ?>
<script type="text/javascript">
	$(document).ready(function(){
		initialize();
		initEvent();
		muraille();
		terrain();
		//bassin();
		arbre();
	});</script>

<script type="text/javascript" src="<?php echo $this->baseUrl()?>/js/contextMenu.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl()?>/js/matrice.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl()?>/js/point.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl()?>/js/event.js"></script>
<link href="<?php echo $this->baseUrl()?>/css/matrice.css" media="screen" rel="stylesheet" type="text/css" >

<div id="map_canvas" style ="width:100%; height:100%"></div>
<div class="containerPlus draggable resizable {buttons:'m', skin:'black', width:'350', height:'500',title:'Menu' }" style="top:10px; left:2%"
id="mainMenu">
	<div id="dock"> </div><div style="clear:both;"></div><br><br>
    <hr>
    <a><b>L&eacute;gendes</b></a>
			
				<div id="id" style = "padding-top : 20px; margin-left:10px;">
				<input id="contour" type="checkbox" class="checkbox" checked="checked" name="name" value="value" />
				Contour<br><br>
				<input id="terrain" type="checkbox" class="checkbox" checked="checked" name="name" value="value" />
				Terrain<br><br>
				<input id="bassin" type="checkbox" class="checkbox" checked="checked" name="name" value="value" />
				Bassin de r&eacute;tention<br><br>
				<input id="arbre" type="checkbox" class="checkbox" checked="checked" name="name" value="value" />
				Arbre<br><br>
				</div>
	<hr>	
	<a><img src ="<?php echo $this->baseUrl()?>/elements/images/panier-moyen.png" /></a>
			
				<div id="id2" style = " margin-left:10px;">
				Terrain : <span id="panierTerrain">0</span>  au panier<br><br>
				Arbre : <span id="panierArbre">0</span> au panier<br><br>
				 <span style ="position : relative; left : 250px;"><b><a href="#"  id = "payer">Acheter</a></b></span>
				
				</div>
	<hr>		
			
    <div style="position:absolute; bottom:10px;">Faire un don | Faire une annonce</div>
  </div>

 <div id="demoContainer" class="containerPlus draggable resizable {buttons:'i,m', skin:'black', width:'350', height:'200',title:'Actualit&eacute;' }" style="bottom:10px; left:2%">
    <div id="dock"> </div><div style="clear:both;"></div>
    <hr>
  </div>

<div class="containerPlus draggable resizable {buttons:'m,i', icon:'browserBr.png', skin:'white', width:'990',iconized:'true', dock:'dock', grid:100, title:'La Matrice'}" style="position:fixed;top:30px;left:150px"
  id= "matrice">
  <br/>
   <br/>
    <div class="evidence">
    <a class="prev browse left"></a>

<!-- root element for scrollable -->
	<div class="scrollable">   
  
   		<!-- root element for the items -->
   		<div class="items">
   
    		 <div class = "selectable" id = "pageBr0" >
     			<?php for ($i = 0; $i <=15; $i++){ for ( $j = 0 ; $j <= 35; $j++ ) { ?>
      			<div class="cell" <?php echo ' i = "'.$i.'" j = "'.$j.'"'?>></div>
      			<div class = "tooltip" id = "BR<?php echo $i."_".$j;?>">
      				<b> BR <span style = "font-size : x-small"><?php echo $i.",".$j ?> </span></b><br/><br/>
      	 			 Pays : S&eacute;n&eacute;gal<br/>
      	  			 R&eacute;gion : Dakar<br/>
      	  			 Disponible : OUI
      			</div>
      			<?php } ?>
      			<br/>
      			<?php } ?>
  			</div>
      
      	
  		</div><!--items !-->
	</div><!--scrollable !-->
   <a class="next browse right"></a>
   </div>
   <div class = "MenuBr"> 
    	<fieldset style ="margin : 20px;"> 
    		<legend>Menu </legend>
    		Localiser Terrain <br/>
    		   i : <input type="text"  name="i" id = "localiserI" size="5"  /><br/>
    		   j : <input type="text"  name="j" id = "localiserJ" size="5"  /> 
    		   <br />
    		   <input type="button" class="button" name="localiser" id="localiser" value="Localiser" />
    		   <input type="button" class="button" name="parcourir" id="parcourirbr" value="Parcourir" />
    	</fieldset>
    
   	    <fieldset style ="margin : 20px;"> <legend>Les Pays </legend>
    		<a href="#" onclick = "seekToCountrie(1)"> Senegal</a><br/>
    		<a href="#" onclick = "seekToCountrie(13)"> Mali </a><br/>
    		<a href="#" onclick = "seekToCountrie(19)"> Niger </a><br/>
    		
    		<a href="#"> Burkina Fasso </a><br/>
    		<a href="#"> Tchad </a><br/>
    		<a href="#"> Soudan </a><br/>
    		<a href="#"> Ethiopie </a><br/>
    		<a href="#"> Djibouti </a>
    	</fieldset>
   </div>
	<div id = "ville1" style = "width : 50px; height : 30px; position :relative; top : -394px;"><b>Dakar</b></div>
	<div id = "ville2" style = "width : 50px; height : 30px; position :relative; top : -424px; left : 700px "><b>Dakar</b></div>
	<div id = "ville3" style = "width : 50px; height : 30px; position :relative; top : -120px;"><b>Dakar</b></div>
	<div id = "ville4" style = "width : 50px; height : 30px; position :relative; top : -150px; left : 650px "><b>Dakar</b></div>
</div>


<div id="newItem" style="display:none">
	<div id ="added"></div>
</div>


<div class="containerPlus draggable resizable {buttons:'m,i', icon:'browserGmv.png', skin:'white', width:'990',iconized:'true', dock:'dock', grid:100, title:'La Matrice GMV'}" style="position:fixed;top:30px;left:100px"
 id= "GMV">
 
 <br/>
    <div class="evidence">
    <a class="prev browse left"></a>

<!-- root element for scrollable -->
<div  class = "myscrollable">   
  
   <!-- root element for the items -->
   <div class="items">
   
      <!-- 1-5 -->
   <div class = "selectable" id = "pageGmv0" >
     			<?php for ($i = 0; $i <=15; $i++){ for ( $j = 0 ; $j <= 35; $j++ ) { ?>
      			<div class="cellArbreGMV" <?php echo ' i = "'.$i.'" j = "'.$j.'"'?>></div>
      			<div class = "tooltip" id = "GMV<?php echo $i."_".$j;?>">
      				<b> GMV <span style = "font-size : x-small"><?php echo $i.",".$j ?> </span></b><br/><br/>
      	 			 Pays : S&eacute;n&eacute;gal<br/>
      	  			 R&eacute;gion : Dakar<br/>
      	  			 Disponible : OUI
      			</div>
      			<?php } ?>
      			<br/>
      			<?php } ?>
  			</div>
      
      	
   </div>

</div>

<div class="overlaya" id="overlaya">

	<div class="details" id="contenuAchat">
		<h3>Achat d'arbre</h3>
</div>
	</div>
<!-- "next page" action -->
<a class="next browse right"></a>

<div class = "MenuBr"> 
    	<fieldset style ="margin : 20px;"> 
    		<legend>Menu </legend>
    		Localiser arbre <br/>
    		   i : <input type="text"  name="i" id = "localiserIarbre" size="5"  /><br/>
    		   j : <input type="text"  name="j" id = "localiserJarbre" size="5"  /> 
    		   <br />
    		   <input type="button" class="button" name="localiser" id="localiserarbre" value="Localiser" />
    		    <br />
    		   <input type="button" class="button" name="parcourir" id="parcourirarbre" value="parcourir" />
    	</fieldset>
    
   	    <fieldset style ="margin : 20px;"> <legend>Les Pays </legend>
    		<a href="#" onclick = "seekToCountrieGmv(1)"> Senegal</a><br/>
    		<a href="#" onclick = "seekToCountrieGmv(13)"> Mauritanie </a><br/>
    		<a href="#" onclick = "seekToCountrieGmv(19)"> Mali </a><br/>
    		<a href="#" onclick = "seekToCountrieGmv(23)"> Niger </a><br/>
    		<a href="#"> Burkina Fasso </a><br/>
    		<a href="#"> Tchad </a><br/>
    		<a href="#"> Soudan </a><br/>
    		<a href="#"> Ethiopie </a><br/>
    		<a href="#"> Djibouti </a>
    		
    	</fieldset>
   </div>
	<div id = "villeGMV1" style = "width : 50px; height : 30px; position :relative; top : -394px;"><b>Dakar</b></div>
	<div id = "villeGMV2" style = "width : 50px; height : 30px; position :relative; top : -424px; left : 700px "><b>Dakar</b></div>
	<div id = "villeGMV3" style = "width : 50px; height : 30px; position :relative; top : -120px;"><b>Dakar</b></div>
	<div id = "villeGMV4" style = "width : 50px; height : 30px; position :relative; top : -150px; left : 650px "><b>Dakar</b></div>

  </div>
</div>
 
 <ul id="myMenuGMV" class="contextMenu"> 
			<li class="edit"><a href="#edit">Ajouter au panier</a></li> 
			<li class="voir"><a href="#voir">Localiser sur la carte</a></li> 
			<li class="focus"><a href="#focus">Faire un focus</a></li> 
			<li class="cut separator"><a href="#cut">Continuer la s&eacute;lection</a></li> 
			
		</ul> 
 <ul id="myMenuBR" class="contextMenu"> 
			<li class="edit"><a href="#edit">Ajouter au panier</a></li> 
			<li class="voir"><a href="#voir">Localiser sur la carte</a></li> 
			<li class="cut separator"><a href="#cut">Continuer la s&eacute;lection</a></li> 
			
		</ul> 


<div id="certificat1" class="overlaycertif" >
	<div id="certif1r1c1" style="width:600px; height:293px;z-index:1; visibility:visible;"><img name="certif1_r1_c1" src="<?php echo $this->baseUrl(); ?>/elements/images/certificat1/images/certif1_r1_c1.png" width="600" height="293" border="0"></div>
    <div id="certif1r2c2" style="width:599px; background: url(<?php echo $this->baseUrl(); ?>/elements/images/certificat1/images/certif1_r2_c2.png); visibility:visible;"> 
		<div align="center">
   			<span style="font-family: Old English Text MT;" >	<b>Zones</b> : </span><span id="zoneArbre" font-size = "small"></span><br/>
   			<span style="font-family: Old English Text MT;" ><b>Arbres</b> : </span><span id="arbres" font-size = "small"></span><br/>
   			soit un total de <span id ="nbreArbre"> </span> Arbres, pour une valeur de <span id="prixArbre"> </span> $
 	</div>
 </div>
 <div id="certif1r3c1" style="width:600px; height:98px;z-index:3; visibility:visible;"><img name="certif1_r3_c1" src="<?php echo $this->baseUrl(); ?>/elements/images/certificat1/images/certif1_r3_c1.png" width="600" height="98" border="0"></div>
 <div id="certif1r4c1" style="width:365px; height:273px;z-index:4; visibility:visible;"><img name="certif1_r4_c1" src="<?php echo $this->baseUrl(); ?>/elements/images/certificat1/images/certif1_r4_c1.png" width="365" height="273" border="0"></div>
 <div id="certif1r4c3" style="position:absolute; background: url(<?php echo $this->baseUrl(); ?>/elements/images/certificat1/images/certif1_r4_c3.png);left:365px; top:429px;width:152px; height:27px;z-index:5; visibility:visible;"><?php print $date ?></div>
 <div id="certif1r4c4" style="position:absolute; left:517px; top:429px;width:83px; height:273px;z-index:6; visibility:visible;"><img name="certif1_r4_c4" src="<?php echo $this->baseUrl(); ?>/elements/images/certificat1/images/certif1_r4_c4.png" width="83" height="273" border="0"></div>
 <div id="certif1r5c3" style="position:absolute; left:365px; top:456px;width:152px; height:246px;z-index:7; visibility:visible;"><img name="certif1_r5_c3" src="<?php echo $this->baseUrl(); ?>/elements/images/certificat1/images/certif1_r5_c3.png" width="152" height="246" border="0"></div>
<div style="position: absolute; top : 0px"><img alt="Imprimer" title="Imprimer" src ="<?php echo $this->baseUrl();?>/elements/images/imprime.png"></div>
</div>



<div id="certificat2" class="overlaycertif" >
<div id="certif2r1c1" style="width:600px; height:325px;z-index:1; visibility:visible;"><img name="certif2_r1_c1" src="<?php echo $this->baseUrl(); ?>/elements/images/certif/images/certif2_r1_c1.png" width="600" height="325" border="0"></div>
<div id="certif2r2c2" style=" background: url(<?php echo $this->baseUrl(); ?>/elements/images/certif/images/certif2_r3_c1.png); visibility:visible;width:599px; z-index:2; visibility:visible;">
	<div align="center">
   			<span style="font-family: Old English Text MT;" ><b>Zones</b> : </span><span id="zoneTerrain" font-size = "small"></span><br/>
   			<span style="font-family: Old English Text MT;" ><b>Terrains</b> : </span><span id="terrains" font-size = "small"></span><br />
   			soit un total de <span id ="nbreTerrain"> </span> Terrains, pour une valeur de <span id="prixTerrain"> </span> $
   </div>
</div>
<div id="certif2r4c1" style="width:600px; height:66px;z-index:3; visibility:visible;"><img name="certif2_r4_c1" src="<?php echo $this->baseUrl(); ?>/elements/images/certif/images/certif2_r3_c1.png" width="600" height="66" border="0"></div>
<div id="certif2r5c1" style="width:365px; height:273px;z-index:4; visibility:visible;"><img name="certif2_r5_c1" src="<?php echo $this->baseUrl(); ?>/elements/images/certif/images/certif2_r4_c1.png" width="365" height="273" border="0"></div>
<div id="certif2r5c3" style="position:absolute; background: url(<?php echo $this->baseUrl(); ?>/elements/images/certif/images/certif2_r4_c3.png); left:365px; top:433px;width:152px; height:27px;z-index:5; visibility:visible;"><?php print $date ?></div>
<div id="certif2r5c4" style="position:absolute; left:517px; top:433px;width:83px; height:273px;z-index:6; visibility:visible;"><img name="certif2_r5_c4" src="<?php echo $this->baseUrl(); ?>/elements/images/certif/images/certif2_r4_c4.png" width="83" height="273" border="0"></div>
<div id="certif2r6c3" style="position:absolute; left:365px; top:450px;width:152px; height:246px;z-index:7; visibility:visible;"><img name="certif2_r6_c3" src="<?php echo $this->baseUrl(); ?>/elements/images/certif/images/certif2_r5_c3.png" width="152" height="246" border="0"></div>

<div style="position: absolute; top : 0px"><img alt="Imprimer" title="Imprimer" src ="<?php echo $this->baseUrl();?>/elements/images/imprime.png"></div>
</div>

<?php require_once("localisation.phtml"); ?>

<div id="achat" class="overlaycertif details" >
 <h3>Vous avez dans votre panier : </h3>
 <br/>
	<ul>
	<li><span id ="spanterrainachat"> </span> terrain(s) pour un montant de  <span id="montantTerrains"></span>$<br/></li>
	<li><span id ="spanarbreachat"> </span> arbre(s) pour un montant de  <span id="montantarbre"></span>$<br/></li>
</ul><br/>
	choisir le mode de paiement et confirmer la transaction

<img src= "<?php echo $this->baseUrl(); ?>/elements/images/visa.jpg" />
  <a href="#" id="confirmAchat">Acheter</a>
</div>
<div id="message" style="display:none;"></div>
<div id="message2"  style="display:none;"></div>
<div id="message3"  style="display:none;" width = "200px"></div>
<div id="message4"  style="display:none; " >
<table width="395" border="0">
  <tr>
    <td width="214"><img src= "<?php echo $this->baseUrl(); ?>/elements/images/arbre1.png" width = "210px" /></td>
    <td width="171"><div align="left" id="message4Content"></div></td>
  </tr>
</table>
</div>
